import { App } from 'vue'
/* // 导入所有base-ui注册的组件
import baseComponents from '@/base-ui/index'
// 导入所有element-ui图标
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
// 导入自定义图标组件
// import LocalIcon from '@/components/LocalIcon/index.vue'
// 导入所有本地svg图标
// const requireLocalIcons = import.meta.globEager('../assets/icons/svg/!*.svg') */

export default {
  // 注意点: 如果要将一个组件封装成一个插件, 那么必须提供一个install方法
  //         那么必须在install方法中注册当前的这个组件
  install (app: App) {
    /*    /!* 注册全局组件 *!/
    /!* 使用 <def-chart></def-chart> *!/
    for (const [key, value] of Object.entries(baseComponents)) {
      const name = `Def${key}`
      app.component(name, value)
    }
    /!* 注册element-plus全局图标 *!/
    /!* 使用 <el-icon-search /> *!/
    /!* 使用 <def-icon icon="search" /> *!/
    for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
      const icon = `ElIcon${key}`
      app.component(icon, component)
    }
    /!* 注册本地全局svg图标 *!/
    /!* 使用 <local-icon icon="search" /> *!/
    /!* 使用 <def-icon icon="def-search" /> *!/
    // requireLocalIcons.keys().forEach(icon => requireLocalIcons(icon))
    // app.component('LocalIcon', LocalIcon) */

    /**
     * 获取屏幕宽高 兼容性处理
     * return {width: 100, height: 100}
     */
    app.config.globalProperties.$getScreen = (): {width: number, height: number} => {
      let width
      let height
      if (window.innerWidth || window.innerHeight) {
        width = window.innerWidth
        height = window.innerHeight
      } else if (document.compatMode === 'BackCompat') {
        width = document.body.clientWidth
        height = document.body.clientHeight
      } else {
        width = document.documentElement.clientWidth
        height = document.documentElement.clientHeight
      }
      return {
        width,
        height
      }
    }
    /**
     * 获取元素样式 兼容性处理
     * @param dom 元素
     * @param name 属性
     * return 500px
     */
    app.config.globalProperties.$getStyleAttr = (dom: any, name: any): string => {
      if (dom.currentStyle) {
        return dom.currentStyle[name]
      } else {
        return getComputedStyle(dom)[name]
      }
    }
    /**
     * 获取页面滚动坐标值 兼容性处理
     * return {x: 100, y: 100}
     */
    app.config.globalProperties.$getPageScroll = (): {x: number, y: number} => {
      let x
      let y
      if (window.pageXOffset || window.pageYOffset) {
        x = window.pageXOffset
        y = window.pageYOffset
      } else if (document.compatMode === 'BackCompat') {
        x = document.body.scrollLeft
        y = document.body.scrollTop
      } else {
        x = document.documentElement.scrollLeft
        y = document.documentElement.scrollTop
      }
      return {
        x,
        y
      }
    }
    // 函数防抖 - 输入框
    app.config.globalProperties.$debounce = function (fn: any, delay: number): any { // fn = test
      let timerId: number | null | undefined = null
      return (...args: any) => {
        timerId && clearTimeout(timerId)
        timerId = window.setTimeout(() => {
          fn.apply(this, args)
        }, delay || 1000)
      }
    }
    // 函数节流 - onscroll/onresize
    app.config.globalProperties.$throttle = function (fn: any, delay: number): any { // fn = test
      let timerId: number | null | undefined = null
      let flag = true
      return (...args: any) => {
        if (!flag) { return }
        flag = false
        timerId && clearTimeout(timerId)
        timerId = window.setTimeout(() => {
          flag = true
          fn.apply(this, args)
        }, delay || 1000)
      }
    }
  }
}
